<template>
  <div class="recommend">
    <span class="title">您是不是在找：</span>
    <nuxt-link
      :to="{ path: url, query: { q:g.keyword}}"
      v-for="g in data"
      :key="g.keyword">
      {{ g.keyword }}
    </nuxt-link>
  </div>
</template>

<script>
  export default {
    props: {
      url: {
        type: String,
        'default': ''
      },
      data: {
        type: Array,
        'default': []
      }
    }
  }
</script>

<style lang="scss" type="text/scss" scoped>
  .recommend {
    background: #fffae6;
    border: 1px solid #f0b184;
    line-height: 40px;
    padding: 0 16px;
    color: #9e9e9e;
    margin-bottom: 20px;
  }

  .title {
    color: #9e9e9e;
  }

  .recommend a {
    color: #3e3e3e;
    margin-left: 30px;
  }

</style>
